<template>
    <el-dialog title="详情" :visible.sync="detailShow" class="business" style="padding:0 10px">
            <div class="part1">
                <p class="labelL">订单号</p>
                <p class="txtR">{{detailData.order_id}}</p>
            </div>
            <div class="part1">
                <p class="labelL">场次id</p>
                <p class="txtR">{{detailData.stage_id}}</p>
            </div>
            <div class="part1">
                <p class="labelL">操作员</p>
                <p class="txtR">{{detailData.operate_name}}</p>
            </div>
            <div class="part1">
                <p class="labelL">流水号</p>
                <p class="txtR">{{detailData.note_no}}</p>
            </div>
            <div class="part1">
                <p class="labelL">状态</p>
                <p class="txtR">{{detailData.order_status_cn}}</p>
            </div>
            <div class="part1">
                <p class="labelL">房间</p>
                <p class="txtR">{{detailData.charmber_name}}&nbsp;&nbsp;{{detailData.room_name}}</p>
            </div>
            <div class="part1">
                <p class="labelL">会员</p>
                <p class="txtR">{{detailData.nickname }}&nbsp;&nbsp;{{detailData.mobile}}</p>
            </div>
            <div class="part1">
                <p class="labelL">来源</p>
                <p class="txtR">{{detailData.platform_cn}}</p>
            </div>
            <div class="part1">
                <p class="labelL">金额</p>
                <p class="txtR">{{detailData.order_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">已付</p>
                <p class="txtR">{{detailData.no_recycle_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">VIP折扣</p>
                <p class="txtR">{{detailData.vip_reduce_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">备用金减免</p>
                <p class="txtR">{{detailData.reduce_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">优惠券减免</p>
                <p class="txtR">{{detailData.coupon_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">实付</p>
                <p class="txtR">{{detailData.total_price}}</p>
            </div>
            <div class="part1">
                <p class="labelL">支付方式</p>
                <p class="txtR">{{detailData.pay_from_cn}}</p>
            </div>
            <div class="part1">
                <p class="labelL">交易号</p>
                <p class="txtR" v-if="detailData.meituan_coupon_no != ''">{{detailData.no_recycle_price}}</p>
                <p class="txtR" v-else-if="detailData.pos_no != ''">{{detailData.pos_no}}</p>
                <p class="txtR" v-else-if="detailData.out_trade_no != ''">{{detailData.out_trade_no}}</p>
                <p class="txtR" else></p>
            </div>
            <div class="part1">
                <p class="labelL">下单时间</p>
                <p class="txtR">{{detailData.order_time}}</p>
            </div>
            <div class="part1">
                <p class="labelL">消费时间段</p>
                <p class="txtR">{{detailData.start_time}}~{{detailData.end_time}}</p>
            </div>
            <div class="part1">
                <p class="labelL">套餐</p>
                <div class="txtR">
                    <div v-if="detailData.fee_items.time_detail.length != 0">
                        <p  v-for="(itemt,t) in detailData.fee_items.time_detail.detail" :key="t">
                            <span>{{itemt.length}} 小时欢唱&nbsp;&nbsp;￥{{itemt.member_price}}</span><br />
                            <span>{{itemt.start_time}} ~ {{itemt.end_time}}</span>
                        </p>
                    </div>
                    <div v-if="detailData.fee_items.items_detail.length != 0">
                        <div v-for="(itemi,i) in detailData.fee_items.items_detail" :key="i">
                                <span style="font-weight:900">{{itemi.item_name}}{{itemi.spec}}*{{itemi.quantity}}&nbsp;￥{{itemi.member_price}}</span><br />
                                <span v-if="itemi.has_time">{{itemi.duration}}小时欢唱</span><br />
                                <div v-if="itemi.items_detail.length != 0">
                                    <p v-for="(itemii,ii) in itemi.items_detail" :key="ii">{{itemii.item_name}}{{itemii.spec}}*{{itemii.quantity}}</p>
                                </div>
                                
                        </div>
                    </div>
                    
                </div>
                
            </div>
            <div class="part1"  v-if="detailData.coupon_no !=''">
                <p class="labelL">优惠券</p>
                <p class="txtR">
                    <span>{{detailData.coupon_no}}</span><br />
                    <span>金额：{{detailData.coupon_price}}</span>
                </p>
            </div>
            <div class="part1">
                <p class="labelL">备注</p>
                <p class="txtR">{{detailData.remarks}}</p>
            </div>
            <div class="part1">
                <p class="labelL">支付时间</p>
                <p class="txtR">{{detailData.pay_time}}</p>
            </div>

        </el-dialog>
</template>
<style lang="scss" scoped>
.part1{
    display: flex;
    flex-direction:row;
    font-size:12px;
    line-height: 20px;
    margin-bottom:5px;
    .labelL{
        width:120px;
        margin-right:15px;
        text-align:right;
        font-size:14px;
    }
    .txtR{
        flex-grow: 1;
    }
}
</style>
<script>
export default {
    props:['detailData','detailShow'],
}
</script>